<!---
/**
 * Zend Framework
 *
 * LICENSE
 *
 * This source file is subject to the new BSD license that is bundled
 * with this package in the file LICENSE.txt.
 * It is also available through the world-wide-web at this URL:
 * http://framework.zend.com/license/new-bsd
 * If you did not receive a copy of the license and are unable to
 * obtain it through the world-wide-web, please send an email
 * to license@zend.com so we can send you a copy immediately.
 *
 * @category   Zend
 * @package    Zend_Gdata
 * @subpackage Demos
 * @copyright  Copyright (c) 2005-2011 Zend Technologies USA Inc. (http://www.zend.com)
 * @license    http://framework.zend.com/license/new-bsd     New BSD License
 */
-->
<html>
<head>
  <title>YouTube data API Video Browser in PHP</title>
  <link href="video_browser.css" type="text/css" rel="stylesheet"/>
  <script src="video_browser.js" type="text/javascript"></script>
</head>
<body>
<div id="main">
  <div id="titleBar">
    <div id="titleText"><h1>YouTube data API Video Browser in PHP</h1></div>
    <div id="searchBox" style="display: none;">
      <form id="searchForm" onsubmit="ytvbp.listVideos(this.queryType.value, this.searchTerm.value, 1); return false;">
        <select name="queryType" onchange="ytvbp.queryTypeChanged(this.value, this.form.searchTerm);">
          <option value="all" selected="true">All Videos</option>
          <option value="top_rated">Top Rated Videos</option>
          <option value="most_viewed">Most Viewed Videos</option>
          <option value="recently_featured">Recently Featured Videos</option>

        </select>
        <input name="searchTerm" type="text" value="puppy">
        <input type="submit" value="Search">
      </form>
    </div>
    <br />
  </div>
  <br clear="all" />
  <div id="mainSearchBox">
    <h2>Search YouTube:</h2>
    <form id="mainSearchForm" onsubmit="ytvbp.listVideos(this.queryType.value, this.searchTerm.value, 1); document.forms.searchForm.searchTerm.value=this.searchTerm.value; ytvbp.hideMainSearch(); document.forms.searchForm.queryType.selectedIndex=this.queryType.selectedIndex; return false;">
      <select name="queryType" onchange="ytvbp.queryTypeChanged(this.value, this.form.searchTerm);">
        <option value="all" selected="true">All Videos</option>
        <option value="top_rated">Top Rated Videos</option>
        <option value="most_viewed">Most Viewed Videos</option>
        <option value="recently_featured">Recently Featured Videos</option>

      </select>
      <input name="searchTerm" type="text" value="puppy">
      <input type="submit" value="Search">
    </form>
  </div>
  <br clear="all" />
  <div id="searchResults">
    <div id="searchResultsListColumn">
      <div id="searchResultsVideoList"></div>
      <div id="searchResultsNavigation">
        <form id="navigationForm">
          <input type="button" id="previousPageButton" onclick="ytvbp.listVideos(ytvbp.previousQueryType, ytvbp.previousSearchTerm, ytvbp.previousPage);" value="Back" style="display: none;"></input>
          <input type="button" id="nextPageButton" onclick="ytvbp.listVideos(ytvbp.previousQueryType, ytvbp.previousSearchTerm, ytvbp.nextPage);" value="Next" style="display: none;"></input>
        </form>
      </div>
    </div>
    <div id="searchResultsVideoColumn">
      <div id="videoPlayer"></div>
    </div> 
  </div>
</div>
</body>
</html>
